
<!DOCTYPE html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test_slider</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript" src="oppostore/rs/js/slides.min.jquery.js"></script> 


<style type="text/css">
body,ul,li{padding:0;margin:0;list-style-type:none;font-size:14px;}
a{text-decoration:none;color:#337ab7;}
.main {
  width: 960px;
  margin: 0 auto;
  line-height: normal;
  left: 218px;
}

/*导航样式*/
#menu {width:960px;height:100px;margin:10px auto;z-index: 900;position: relative;} 
#menu ul li{margin:auto 5px;position:relative;width:120px;height:40px;text-align:center;line-height:40px;float:left;background-color:gainsboro;}
#menu ul li:hover{display:block;background-color:#AD8B8B;color:#FFF;font-size:17px;}
#menu ul li ul{display:none;}
#menu ul li:hover ul{position:absolute;display:block;left:-5px;}/*top:51px;*/
#menu ul li:hover ul li{float:none;background-color:#C4C8D1;}/*float:none;*/
#menu ul li:hover ul li:hover a{display:block;color:#C4C8D1;background-color:#908B8B;font-size:17px;}
#menu ul li:hover ul li ul{display:none;}
#menu ul li:hover ul li:hover ul{position:absolute;display:block;left:115px;top:0px;}
#menu ul li:hover ul li:hover ul li:hover a{display:block;color:#FFF;background-color:#C4C0C0;font-size:17px;}

/*中间轮播样式*/
.mydiv{width: 400px;margin-left: auto;margin-right: auto;}
.pagination{list-style-type: none;display: inline-block; *display: inline; zoom: 1;}
.pagination>li{float: left;padding-left: 5px;padding-right: 5px;}
div#slides {text-align: center;}
.current{background-color: #E9E7E7;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius:5px;}

/*底部样式*/
.new_notice {width:99.8%;font-size:18px;border:1px solid #DDDDDD;overflow:hidden;}
.new_notice h3 {position:absolute;left:16px;font-size:14px;margin-top:10px;}
.notices {width:958px;height:40px;position:relative;overflow:hidden; margin:auto;}
.notices a{font-size:14px;}
.notices a:hover{text-decoration:underline;}
.notice {width:500px;margin:auto;line-height:14px;}
.new_notice ul.slides_container {height:50px;width:680px;margin-right:0px;overflow:hidden;top:10px;}
.new_notice ul.slides_container li {height:50px;text-align:center;}
.new_notice .next {position:absolute;top:12px;left:900px;}
.new_notice .prev {position:absolute;top:12px;left:840px;}

.update {
  float: left;
  width: 49%;
  height: 200px;
  border: 1px solid #DDDDDD;
}
.hot_toptic {
  width: 49%;
  height: 110px;
  border: 1px solid #DDDDDD;
  float: right;
  height: 200px;
}
.wrapper {
  clear: both;
  margin: 12px auto 0;
  overflow: hidden;
  width: 960px;
}
.update_logo, .hot_toptic_logo{
  width: 44%;
  float: left;
  height: 137px;
}
.update_text, .hot_toptic_text{
  width: 55%;
  float: right;
  height: 137px;
}
.divide {
  margin-top: 20px;
}


</style>

</head>
<body>
<div class="main"> 
<div id="menu">
 <ul> 
    <li><a href="#">路飞</a>
        <ul>
            <li><a href="#">新建</a></li> 
            <li><a href="#">打开</a>
                <ul>
                    <li><a href="#">文档</a></li>
                    <li><a href="#">图片</a></li>
                    <li><a href="#">视频</a></li>
                    <li><a href="#">音乐</a></li>
                </ul> 
            </li>
            <li><a href="#">保存</a></li>
            <li><a href="#">导入</a></li>
            <li><a href="#">关闭</a></li>
        </ul>
    </li>
  <li><a href="#">卓洛</a>
       <ul>
            <li><a href="#">复制</a></li>
            <li><a href="#">黏贴</a></li>
            <li><a href="#">删除</a></li>
            <li><a href="#">替换</a></li>
            <li><a href="#">打印</a></li>
       </ul>
  </li>
  <li><a href="#">香吉士</a>
       <ul>
            <li><a href="#">图层</a></li>
            <li><a href="#">标尺</a></li>
            <li><a href="#">查找</a></li>
            <li><a href="#">格式</a></li>
            <li><a href="#">图片</a></li>
       </ul>
  </li>
  <li><a href="#">娜美</a>
       <ul>
            <li><a href="#">工具</a>
                 <ul>
                      <li><a href="#">显示</a></li>
                      <li><a href="#">隐藏</a></li>
                      <li><a href="#">增加</a></li>
                      <li><a href="#">删减</a></li>
                 </ul>
            </li>
            <li><a href="#">重置</a></li>
            <li><a href="#">布局</a></li>
            <li><a href="#">数据</a></li>
            <li><a href="#">测试</a></li>
       </ul> 
  </li>
  <li><a href="#">罗宾</a> 
       <ul>
            <li><a href="#">管理</a></li>
            <li><a href="#">添加</a></li>
            <li><a href="#">导出</a></li>
            <li><a href="#">参考</a> 
                 <ul>
                      <li><a href="#">手册</a></li>
                      <li><a href="#">导向</a></li>
                      <li><a href="#">帮助</a></li>
                      <li><a href="#">版本</a></li>
                 </ul>   
            </li>
            <li><a href="#">升级</a></li>
       </ul>  
  </li>
  <li><a href="#">乌索普</a></li>
  <li><a href="#">弗兰奇</a></li>
 </ul>
</div>
<div style="clear: both;"></div>
<div class="mydiv">
  <div id="slides"  text-align="center">
  <ul class="slides_container" >
      <li>
      <div style="left:0; top:0; "><a href="player-detail.php?id=13" target="_blank"> <img src="rsc/11.jpg" alt="海贼王1" ></a></div>
      </li>
      <li>
      <div style="left:0; top:0; "><a href="player-detail.php?id=13" target="_blank"> <img src="rsc/22.jpg" alt="海贼王1"></a></div>
      </li>
    <li>
    <div style="left:0; top:0;"><a href="player-detail.php?id=13" target="_blank"> <img src="rsc/33.jpg" alt="海贼王1" ></a></div>
    </li>     
  </ul>
  <div style="clear: both;"></div>
  </div>
</div>
<div style="clear: both;"></div>
<div class="new_notice">
    <div class="notices">
        <div class="notice" id="slides2">
            <h3><a href="birth.php?tab_id=1">最新资讯</a>&nbsp;&nbsp;&nbsp;&nbsp;|</h3>             
            <ul class="slides_container">
              <li>
                   <a href="shownews.php?tab_id=48">OPPO影音携手华数传媒推出在线视频服务</a>
                </li>
              <li>
                   <a href="shownews.php?tab_id=47">[活动结束]OPPO PM-3 & HA-2新品试听会武汉站</a>
                </li>
              <li>
                   <a href="shownews.php?tab_id=46">广州国际音响唱片展 OPPO最新音频展示</a>
                </li>
             <li>
                  <a href="shownews.php?tab_id=45">OPPO PM-3便携式平面振膜耳机 打造移动HIFI巅峰神器</a>
                </li>
             <li>
                  <a href="shownews.php?tab_id=42">极致原音 OPPO PM-1耳机斩获EISA年度HIFI大奖</a>
                </li>
             <li>
                  <a href="shownews.php?tab_id=41">【OPPO PM-2重磅上市】来重庆，让你体验极致原音！</a>
                </li>
             <li>
                  <a href="shownews.php?tab_id=40">OPPO PM-1平面振膜耳机臻享试听会，北京站圆满结束！</a>
                </li>
             <li>
                  <a href="shownews.php?tab_id=39">OPPO PM-1荣获EISA 2014-2015年度HIFI大奖</a>
                </li>
            <li>
                  <a href="shownews.php?tab_id=38">(活动结束)相约上海，OPPO PM-1臻享试听会</a>
                </li>
                <li>
                  <a href="shownews.php?tab_id=37">avforums - OPPO PM-1平面振膜耳机评测 --蓝光巨头将它的目光转移到了耳机市场</a>
                </li>
             <li>
                  <a href="shownews.php?tab_id=36">数字家庭 - 走进OPPO PM-1耳机</a>
                </li>
             <li>
                  <a href="shownews.php?tab_id=35">cnet - OPPO新耳机，惊世之作PM-1</a>
                </li>
             <li>
                  <a href="shownews.php?tab_id=34">HiVi BestBuy 2014 夏季篇  OPPO BDP-103D、BDP-105D登上蓝光机类别榜首</a>
                </li>
                 <li>
                  <a href="shownews.php?tab_id=33">OPPO PM-1耳机 荣获欧洲顶级影音杂志WHATHIFI五星推荐</a>
                </li>
             <li>
                  <a href="shownews.php?tab_id=32">OPPO带你领略巴西世界杯视觉盛宴</a>
                </li>
            <li>
                  <a href="shownews.php?tab_id=31">业界革命，OPPO发布全球最高灵敏度平面振膜耳机PM-1（更新录像）</a>
                </li>
           
             <li>
                  <a href="shownews.php?tab_id=30">2014SIAV上海国际高级Hi-Fi展</a>
                </li>
             <li>
                  <a href="shownews.php?tab_id=29">OPPO蓝光影音鉴赏会 北京站</a>
                </li>
            <li>
                  <a href="shownews.php?tab_id=27">BDP-105D首发！OPPO影音上海鉴赏会</a>
                </li>
             <li>
                  <a href="shownews.php?tab_id=26">年终豪礼 刻不容缓</a>
                </li>
            <li>
                  <a href="shownews.php?tab_id=25">美国PCMag年度读者选择奖 OPPO蓝光成就三连冠</a>
                </li>
                                
            </ul>
            <a href="#" class="prev prev1">下一条</a>
            <a href="#" class="next next1">上一条</a>
        </div>        
    </div>
</div>
<div class="wrapper">
  <div class="update">             
       <div class="update_logo" >
         <h2 style="line-height:30px;">
           <a href="#" >悬赏信息</a>
         </h2>
         <a href="#"><img src="rsc/4.jpg" style="width:206px;height:157px;"></img></a>
       </div>
      <!--  <img src="rs/css/images/update.jpg" alt="" />-->
      <div class = "update_text">
        <h3><a href="#" >乌索普成为5亿悬赏对象</a></h3><br/>
        <p><a href="#" >德雷斯大新闻</a></p><br/>
        <p><a href="#" >“拥有超强狙击能力，在新的一战中展现了新的实力，千里吓晕砂糖，成功为路飞清路”</a></p>
      </div>
  </div>
  <div class="hot_toptic">
       <h3 style="line-height:30px;"> <a href="#" >热门话题</a></h3><br/>
       <div class="hot_toptic_logo">
         <a href="http://weibo.com/u/1718461005?s=6uyXnP" target="_blank">
             <img border="0" src="rsc/5.jpg"/ style="width:206px;">
         </a>
       </div>
       <div class = "hot_toptic_text">
        <h3><a href="#" >明哥真的会死么？</a></h3><br/>
        <p><a href="#" >海贼王漫画790话情报:明哥死亡凯多惊现 索隆领衔10大新剑豪</a></p><br/>
      </div>       
  </div>
</div>
<div class="divide" style="width:960px;border-bottom: 1px solid rgb(196, 196, 196);"></div>
<div style="font-size:12px;display:block;width:500px;float:left;">  
  <h3><a href="#" >友情链接&nbsp;@ 天下海米是一家论坛</a></h3>
</div>

<div style="float:right;"><a href="#" target="_blank"> <img src="rsc/6.jpg" height="50px"></a></div>

<script type="text/javascript" src="http://tajs.qq.com/stats?sId=34367213" charset="UTF-8"></script>

</div>
</div>

  <script type="text/javascript">
  console.log("hello");
      $(function(){
            $("#slides2").slides({
                preload: true,
                preloadImage: 'oppostore/rs/images/loading.gif',
                play: 5000,
                pause: 5000,
                hoverPause: true,
                pagination:false,
                generatePagination: false,
                next : 'next1',
                prev : 'prev1'
                });              
          });


      $(function(){
            $("#slides").slides({
                preload: true,
                preloadImage: 'oppostore/rs/images/loading.gif',
                play: 3000,
                pause: 5000,
                hoverPause: true,
                pagination:true,
                generatePagination: true,
                next : 'next1',
                prev : 'prev1'
                });
    
          });
        
        </script>
</body>
</html>